<template>
  <div class="child-home">
    <h1>子应用首页</h1>
    
    <!-- 显示主应用传递的数据 -->
    <div v-if="appData.user">
      欢迎, {{ appData.user.name }}
    </div>
    <button @click="sendDataToMain">发送数据到主应用</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      appData: {}
    }
  },
  mounted() {
    // 监听主应用数据变化
    if (window.microApp) {
      this.appData = window.microApp.getData() || {}
      
      window.microApp.addDataListener(data => {
        console.log('收到主应用数据:', data)
        this.appData = { ...this.appData, ...data }
      })
    }
  },
  beforeUnmount() {
    // 移除监听器
    if (window.microApp) {
      window.microApp.removeDataListener()
    }
  },
  methods: {
    sendDataToMain() {
      if (window.microApp) {
        window.microApp.dispatch({
          message: '来自子应用的消息',
          timestamp: Date.now()
        })
      }
    }
  }
}
</script>